<%--
  Created by IntelliJ IDEA.
  User: admin
  Date: 2023/3/9
  Time: 10:26
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--引入jQuery--%>
<script src="/webjars/jquery/3.6.0/jquery.min.js"></script>
<%--引入bootstrap--%>
<link rel="stylesheet" href="/webjars/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="/webjars/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<style>
    .table{
        text-align: center;
    }
</style>
<script>
    //点击超链接跳转到对应页面
    function skinPage(v) {
    //为表单隐藏域赋值
        $("#page").val(v)
        // 提交表单
        document.forms[0].submit()
    }
</script>
<html>
<head>
    <title>Title</title>
</head>
<body>

  <div class="container">
      <div class="panel panel-primary">
          <div class="panel-heading">
              <h3 class="panel-title">
                  <h3>学生管理系统</h3>
              </h3>
          </div>
<%--          table-striped:带条纹的表格--%>
          <table class="table table-striped table-hover">
              <tr>
                  <td>学号</td>
                  <td>姓名</td>
                  <td>班级</td>
                  <td>年龄</td>
                  <td>性别</td>
                  <td>住址</td>
                  <td>操作</td>
              </tr>
<%--              遍历spring容器里的学生数组--%>
<%--              取出分页后的单页结果进行遍历--%>
              <c:forEach items="${pr.rows}" var="s">
              <tr>
                  <td>${s.sid}</td>
                  <td>${s.sname}</td>
                  <td>${s.cname}</td>
                  <td>${s.age}</td>
                  <td>${s.sex}</td>
                  <td>${s.addr}</td>
                  <td>
<%--                      根据传入的不同的sid默认先填写好学生信息,再进行编辑--%>
            <a href="/student/edit.do?sid=${s.sid}" class="btn-success btn-sm">修改</a>
            <a href="/student/delete.do?sid=${s.sid}" onclick="return confirm('确定删除${s.sname}吗?')" class="btn-danger btn-sm">删除</a>
                  </td>
              </tr>
              </c:forEach>
          </table>
          <div class="panel-body text-right">
<%--              设置条件查询表单--%>
              <form class="form-inline" style="float:left;" method="post" action="/student/search.do">
<%--                  查询的学生姓名--%>
                  <input type="hidden" name="page" id="page" value="${param.page}">
                  <div class="form-group">
                      <input type="text" class="form-control" id="sname" name="sname" value="${student.sname}" placeholder="学生姓名">
                  </div>
<%--                    查询的学生住址--%>
                  <div class="form-group">
                      <input type="text" class="form-control" id="addr" name="addr" value="${student.addr}" placeholder="学生住址">
                  </div>
<%--                    查询的学生班级--%>
                  <div class="form-group">
                      <select class="form-control" name="cid" id="cid">
                          <option value="0">所在班级</option>
                          <c:forEach items="${classes}" var="c">
                              <option value="${c.cid}" ${c.cid==student.cid?'selected':''}>${c.cname}</option>
                          </c:forEach>
                      </select>
                  </div>
                  <button type="submit" class="btn btn-default btn-sm btn-primary">查询</button>
                  <a href="/student/edit.do" class="btn btn-default btn-sm btn-primary">添加</a>
              </form>
<%--              分页导航--%>
              <nav aria-label="Page navigation">
                  <ul class="pagination">
                      <li>
                          <a href="#" aria-label="Previous">
                              <span aria-hidden="true">&laquo;</span>
                          </a>
                      </li>
<%--                      分页栏,开始为第一页,结束为分页的总页数--%>
                      <c:forEach begin="1" end="${pr.totalPage}" var="p">
<%--                          点击数字时的跳转路径--%>
                         <li class="${p ==pr.page?'active':''}">
                             <a onclick="skinPage(${p})">${p}</a>
<%--                             <a href="/student/search.do?page=${p}" onclick="skinPage(${p})">${p}</a>--%>
                         </li>
                      </c:forEach>
                      <li>
                          <a href="#" aria-label="Next">
                              <span aria-hidden="true">&raquo;</span>
                          </a>
                      </li>
                  </ul>
              </nav>
          </div>
      </div>
  </div>
</body>
</html>
